<template>
  <view class="top">
    <uni-card style="border-radius: 10px;margin-top: 0px;height: 550px;display: flex;justify-content: center;">
      <image style="height: 123px;width: 180px;margin-left: 65px;" src="../../../static/images/ly/组 7.png"></image>
      <view>
        <view class="xinxi">
          <view class="xinxi1">车辆类型</view>
          <view class="xinxi2">
            <uni-data-select
                v-model="cheCar.carType"
                :localdata="maDou"
            ></uni-data-select>
          </view>
        </view>
        <view class="xinxi">
          <view class="xinxi1">车辆型号</view>
          <view class="xinxi2">
            <uni-data-select
                v-model="cheCar.carModel"
                :localdata="a91tv"
            ></uni-data-select>
          </view>
        </view>
        <view class="xinxi">
          <view class="xinxi1">车牌号码</view>
          <view class="xinxi2"><input v-model="cheCar.carNumber" type="text" placeholder="请输入您的车牌号"/></view>
        </view>
        <!--        <view class="xinxi">-->
        <!--          <view class="xinxi1">车主姓名</view>-->
        <!--          <view class="xinxi2"><input type="text" placeholder="请输入您的姓名"/></view>-->
        <!--        </view>-->
        <view class="xinxi">
          <view class="xinxi1">电话号码</view>
          <view class="xinxi2"><input type="text" placeholder="请输入您的手机号"/></view>
        </view>
        <!--        <view class="xinxi">-->
        <!--          <view class="xinxi1">照片</view>-->
        <!--          <view>-->
        <!--            <u-grid :border="false">-->
        <!--&lt;!&ndash;              :fileList="fileList1"&ndash;&gt;-->
        <!--              <u-upload-->

        <!--                  @afterRead="afterRead"-->
        <!--                  @delete="deletePic"-->
        <!--                  name="1"-->
        <!--                  multiple-->
        <!--                  :maxCount="10"-->
        <!--              ></u-upload>-->
        <!--            </u-grid>-->
        <!--            <u-toast ref="uToast"/>-->
        <!--          </view>-->
        <!--        </view>-->
      </view>

    </uni-card>

    <!--    <u-tabbar :value="value6" @change="name => value6 = name" :fixed="true" :placeholder="true"-->
    <!--              :safeAreaInsetBottom="true" :border="false">-->
    <u-tabbar :fixed="true" :placeholder="true"
              :safeAreaInsetBottom="true" :border="false">
      <button class="button" type="primary" @click="addCar">+ 添加车辆</button>
    </u-tabbar>
  </view>
</template>

<script>
export default {
  data() {
    return {
      cheCar: {
        userId: '',
        carType: '',
        carModel: '',
        carNumber: '',
        type: 1,
        photo: ''
      },
      maDou: [
        {value: 0, text: "宝马"},
        {value: 1, text: "奥迪"},
        {value: 2, text: "法拉利"},
      ],
      a91tv: [
        {value: 0, text: "旗舰款"},
        {value: 1, text: "限定款"},
        {value: 2, text: "正常款"},
      ],

    }
  },
  methods: {
    addCar() {
      const that = this;
      this.$http({
        url: `/api/car/car`,
        method: 'POST',
        data: that.cheCar,
        success(res) {
          console.log(res);
          if (res.data.code === 200) {
            uni.showToast({
              title: '添加成功',
              icon: 'none',
              duration: 2000
            });
            setTimeout(() => {
              uni.navigateBack({
                delta: 1
              })
            })
          }
        }
      })
    },
  },
  onLoad() {
    this.cheCar.userId = uni.getStorageSync("user_id")
  },
}
</script>

<style>
.top {
  height: 150px;
  background-image: url("../../../static/images/ly/组 6.png");
}

.button {
  height: 30px;
  width: 220px;
  font-size: 15px;
  background-color: #3486FD;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
}

.xinxi {
  display: flex;
  margin-top: 20px;
}

.xinxi1 {
  background-color: #4FA2FF;
  height: 30px;
  width: 80px;
  border-radius: 15px;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
}

.xinxi2 input {
  border: 1px solid darkgray;
  height: 30px;
  border-radius: 15px;
  padding: 0 10px;
}
</style>